<template>
	<view :class="['type_main',current === 1?'type1':'type0']" :style="{'--color':vuex_config.themeColor1}">
		<u-sticky>
			<u-tabs :active-color="vuex_config.themeColor1" :height="80" :list="tabList" :is-scroll="false"
				:current="current" @change="change"></u-tabs>
		</u-sticky>
		<view v-show="current === 0">
			<query-view @change="changeTime" ref="view_0"></query-view>
		</view>
		<view v-show="current === 1">
			<statis-view ref="view_1"></statis-view>
		</view>
		<!-- 	  <view v-show="current === 2">
	  	<adjust ref="view_2"></adjust>
	  </view> -->
	</view>
</template>

<script>
	import queryView from './components/query.vue'
	import statisView from './components/statis.vue'
	export default {
		data() {
			return {
				tabList: [{
						name: '查询'
					},
					{
						name: '统计'
					},
					// {
					// 	name: '明细'
					// },
				],
				current: 0
			};
		},
		components: {
			'query-view': queryView,
			'statis-view': statisView
		},
		methods: {
			changeTime(obj) {
				this.current = 1
				this.$nextTick(() => {
					let str = 'view_' + this.current
					if (this.$refs[str] && this.$refs[str].init) {
						this.$refs[str].init({
							...obj
						})
					}
				})
			},
			change(index) {
				this.current = index
				this.$nextTick(() => {
					let str = 'view_' + this.current
					if (this.$refs[str] && this.$refs[str].init) {
						this.$refs[str].init()
					}
				})
			}
		},
	};
</script>
<style scoped lang="scss">
	.type_main {
		min-height: 100vh;
	}

	.type1 {
		background-color: #fff;
	}

	.type0 {
		background-color: #F5F5F5;
	}
</style>
